<template>
  <a-modal
    title="修改切面关键词类型"
    wrapClassName="common_modal audit_hosp_modal"
    v-model:open="visible"
    :confirm-loading="confirmLoading"
    @ok="handleOk"
    @cancel="handleCancel"
    centered
  >
    <a-row>
      <a-form
        ref="updateFormRef"
        :model="formInfo"
        :rules="rules"
        :label-col="{ span: 6 }"
        :wrapper-col="{ span: 18 }"
      >
        <a-col :span="24">
          <a-form-item label="所属医院" name="id">
            <a-select
              v-model:value="formInfo.id"
              show-search
              :filter-option="filterOption"
              popupClassName="common_select_dropdown"
            >
              <a-select-option v-for="item in props.hospList" :value="item.id" :key="item.id">
                {{ item.desc }}
              </a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="24">
          <a-form-item label="关键词类型" name="keywordType">
            <a-select v-model="formInfo.keywordType" popupClassName="common_select_dropdown">
              <a-select-option
                v-for="item in props.keywordList"
                :value="item.value"
                :key="item.value"
              >
                {{ item.label }}
              </a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
      </a-form>
    </a-row>
  </a-modal>
</template>
<script setup lang="ts">
// import { axiosPost } from '@/api/request'
import { ref } from 'vue'
import { updateProps } from './props'
import { filterOption } from '@/utils/filter_util'
import { hospUpdateKeyword } from '@/axios/api/hosp_api'
import { message } from 'ant-design-vue'
const emit = defineEmits(['getPage'])
const [messageApi] = message.useMessage()
const props = defineProps(updateProps)
const visible = ref(false)
const confirmLoading = ref(false)
const updateFormRef = ref()
const formInfo = ref({
  id: '',
  keywordType: ''
})
const rules = {
  id: [{ required: true, message: '请选择医院', trigger: ['change', 'blur'] }]
}
function showModal(data: any) {
  formInfo.value.id = data.hospId
  formInfo.value.keywordType = data.keywordType
  visible.value = true
}
function handleOk() {
  updateFormRef.value
    .validate()
    .then(() => {
      confirmLoading.value = true
      hospUpdateKeyword(formInfo.value)
        .then((res) => {
          if (res.code === 200) {
            messageApi.success(res.msg)
            emit('getPage')
            handleCancel()
          }
          confirmLoading.value = false
        })
        .catch(() => {
          confirmLoading.value = false
        })
    })
    .catch((err: any) => {
      console.log('%c [ err ]-197', 'font-size:13px; background:pink; color:#bf2c9f;', err)
    })
}
function handleCancel() {
  visible.value = false
  formInfo.value = {
    id: '',
    keywordType: ''
  }
}
defineExpose({
  showModal
})
</script>
